<template>
	<div id="indexDefault" class="indexDefault">
		<img class="default-imgBg" src="/static/img/welcome/1picture.png" width="971px"
		 height="635px">
		<div class="default-apply-click">
			<p>快速报名入口</p>
			<div class="indexDefault-lists">
				<router-link target="_blank" to="/index">
					快速报名入口
				</router-link>
			</div>
		</div>
		<div class="default-notice">
			<img src="/static/img/welcome/attention.png">
		</div>
		<div class="default-download">
			<p>下载区域</p>
			<div class="indexDefault-lists">
				<ul class="indexDefault-li">
					<li>
						<a target="_blank" href="http://hdf.xclearn.com:8999/group2/M00/00/3F/rBChtltxRM6ABGoTAAAqip_PYEs39.xlsx" title="企业报名二建主项模板"><img
							 src="/static/img/welcome/excelicon.png" width="65px" height="60px"><span>企业报名二建主项模板</span>
						</a>
					</li>
					<li>
						<a target="_blank" href="http://hdf.xclearn.com:8999/group2/M00/00/47/rBCht1txRKuAR5-CAAArQyOI3LM42.xlsx" title="企业报名二建增项模板"><img
							 src="/static/img/welcome/excelicon.png" width="65px" height="60px"><span>企业报名二建增项模板</span>
						</a>
					</li>
					<li>
						<a target="_blank" href="http://hdf.xclearn.com:8999/group2/M00/00/47/rBCht1txROiASCsIAAAzHc-sx8g94.xlsx" title="企业报名岗位人员模板"><img
							 src="/static/img/welcome/excelicon.png" width="65px" height="60px"><span>企业报名岗位人员模板</span>
						</a>
					</li>

				</ul>
			</div>

		</div>
	</div>
</template>

<script>
	export default {
		name: 'welcome',
		data() {
			return {}
		}
	}
</script>

<style>
	.indexDefault {
		width: 97%;
		min-height: 800px;
		border: 1px solid #dddddd;
		position: relative;
		margin: 0 auto;
		text-align: center;
	}

	.default-imgBg {
		position: absolute;
		top: 21px;
		left: 50%;
		z-index: -16;
		margin-left: -511px;
	}

	.indexDefault-bg {
		position: absolute;
		z-index: -10;
	}

	.default-notice {
		text-align: right;
		margin: 30px 30px 24px 0;
	}

	.default-download {
		text-align: left;
		margin: 0 30px;
		border: 1px solid #dfdfdf;
		height: 188px;
		position: absolute;
		bottom: 20px;
		width: 95%;
	}

	.default-download p {
		width: 70px;
		height: 188px;
		background: #448db8;
		opacity: 0.6;
		filter: alpha(opacity=60);
		color: #fff;
		padding: 30px;
		padding-top: 54px;
		font-size: 16px;
		float: left;
		margin: 0;
		box-sizing: border-box;
	}

	.default-download .indexDefault-lists,
	.default-apply-click .indexDefault-lists {
		float: left;
		width: calc(100% - 80px);
		height: 188px;
		background: rgba(255, 255, 255, 0.6);
	}

	.default-download .indexDefault-lists ul {
		margin: 0;
	}

	.default-download .indexDefault-lists ul li {
		height: 80px;
		float: left;
		margin-left: 50px;
		margin-top: 16px;
		list-style: none;
	}

	.default-download .indexDefault-lists ul li a:hover,
	.default-download .indexDefault-lists ul li a:link {
		text-decoration: none;
	}

	.default-download .indexDefault-lists ul li a {
		color: #666666;
		font-size: 16px;
	}

	.default-download .indexDefault-lists ul li a span {
		position: relative;
		top: -26px;
	}

	.indexDefault-li a img {
		padding-right: 20px;
	}


	.default-apply-click {
		position: absolute;
		top: 30px;
	}

	.default-apply-click a:hover,
	.default-apply-click a:visited,
	.default-apply-click a:link,
	.default-select-typeId:hover,
	.default-select-typeId:link {
		text-decoration: none;
		color: #FFF;
	}

	.default-apply-click .indexDefault-lists {
		width: 419px;
		text-align: left;
		border: 1px solid #dfdfdf;
		background: #fff;
		opacity: 0.8;
	}

	.default-apply-click a {
		padding: 16px 20px;
		background: #438EB9;
		color: #fff;
		display: inline-block;
		border-radius: 4px;
		font-size: 16px;
		margin-left: 20px;
		margin-top: 36px;
	}


	.default-apply-click p {
		width: 70px;
		height: 190px;
		background: #448db8;
		opacity: 0.6;
		filter: alpha(opacity=60);
		color: #fff;
		padding: 20px;
		padding-top: 30px;
		font-size: 16px;
		float: left;
		margin: 0;
		margin-left: 30px;
		box-sizing: border-box;
	}

	.default-attention {
		font-size: 16px;
		color: #f00;
		margin: 40px 20px;
	}
</style>
